<template>
  <div>
    <div class="mb-40">
      <div class="flex-space-between">
        <div style="min-height: 1px"></div>
        <!--      热门分类-->
        <div class="label-grouping-div">
          <el-menu
            v-if="!labelGroupingDialog"
            :default-active="$route.path"
            :router="true"
            mode="horizontal"
            text-color="rgba(0, 0, 0, 0.7)"
            :active-text-color="themeColor"
            class="el-menu-demo">
            <el-menu-item v-for="(item,index) in sidebarList" :index="item.route" :title="item.sidebarName"
                          :key="index">
              <nuxt-link :to="item.route">
                <span class="font-s-16">{{ item.sidebarName }}</span>
              </nuxt-link>
            </el-menu-item>
            <el-menu-item>
              <span class="color-grey-3">|</span>
            </el-menu-item>
            <el-menu-item v-for="(item,index) in labelGroupingList" :index="'/popular-group/'+item.id"
                          :title="'分类：'+item.groupingName" :key="index">
              <nuxt-link :to="'/popular-group/'+item.id" class="font-s-14">
                <span class="font-s-15">{{ item.groupingName }}</span>
              </nuxt-link>
            </el-menu-item>
          </el-menu>
        </div>
        <div style="min-height: 1px"></div>
      </div>
      <div class="_module_explicit mt-20">
        <div class="marquee">
          <p class="color-grey">📱 手机端只开放部分功能 | 💻 推荐使用PC端体验完整功能...</p>
        </div>
      </div>
    </div>
    <div class="index-main">
      <!--      左侧-->
      <div style="line-height: 1px">
      </div>
      <!--    中间侧-->
      <div class="article-index-content">
        <nuxt-child/>
      </div>
      <!--    右侧-->
      <div class="index-right _module_hiding">
        <div :class="{'recommend-article-div-true':positionCssRight,'recommend-article-div-false':!positionCssRight}">
          <div class="mb-15 sigIn-info padding-10 border-radius-10"
               v-show="positionCssRight">
            <div v-show="!reportLoading" class="flex-space-between">
              <div>
                <p class="font-bold font-s-16 mb-6" v-if="isReport">连续签到<span
                  class="color-stand-out ml-4">
                  {{ ctnFatalism }}天</span>
                </p>
                <p class="font-bold font-s-16 mb-6" v-if="!isReport">{{
                    $utils.obtainTimePeriod(new Date())
                  }}好！</p>
                <p class="font-s-14 line-height-18 color-grey">点亮在{{ websiteName }}的每一天</p>
              </div>
              <el-button size="medium" @click="signIn">
                {{ isReport ? '已签到' : '去签到' }}
              </el-button>
            </div>
          </div>
          <!--            站点总数据-->
          <div class="website-data mt-10" v-show="positionCssRight">
            <div class="font-s-16 mb-10 flex-space-between">
              <div>
                <svg t="1746426533762" class="icon-theme icon-size-16 svg-translateY-2" viewBox="0 0 1024 1024"
                     version="1.1"
                     xmlns="http://www.w3.org/2000/svg" p-id="3564">
                  <path
                    d="M921.6 0a102.4 102.4 0 0 0-102.4 102.4v819.2a102.4 102.4 0 0 0 204.8 0V102.4A102.4 102.4 0 0 0 921.6 0zM204.8 230.4a102.4 102.4 0 0 0-204.8 0v691.2a102.4 102.4 0 0 0 204.8 0V230.4z m409.6 268.8a102.4 102.4 0 0 0-204.8 0v422.4a102.4 102.4 0 0 0 204.8 0V499.2z"
                    p-id="3565"></path>
                </svg>
                <span>站点数据</span>
              </div>
              <div v-if="userInfo" class="font-s-15">
                <div v-if="userInfo.roleId==1" class="cursor-pointer" style="color:#f79f1f;"
                     @click="becomeCreatorDialog=true">
                  <el-popover
                    placement="top-start"
                    width="200"
                    trigger="hover"
                    content="点击【成为创作者】即可申请成为创作者，创作者可以编写文章、记录时光小记和阅读随笔。">
                    <div slot="reference">
                      <svg t="1763107792950" class="icon-theme-f79f1f svg-translateY-2" viewBox="0 0 1024 1024"
                           version="1.1"
                           xmlns="http://www.w3.org/2000/svg" p-id="28157" width="16" height="16">
                        <path
                          d="M923.904 490.453333l-348.714667-336.64A90.922667 90.922667 0 0 0 512 128c-23.466667 0-45.994667 9.216-63.146667 25.770667l-348.757333 336.682666c-6.826667 6.570667-11.52 15.146667-13.610667 24.533334-2.048 9.386667-1.365333 19.242667 2.048 28.245333 3.413333 8.96 9.301333 16.682667 16.981334 22.186667 7.68 5.418667 16.768 8.32 26.069333 8.362666H298.666667v155.733334c0 10.24 3.925333 20.010667 10.88 27.221333 6.954667 7.210667 16.384 11.264 26.197333 11.264h362.624c9.813333 0 19.242667-4.053333 26.197333-11.264a39.253333 39.253333 0 0 0 10.88-27.221333v-155.733334h156.885334c9.301333 0 18.389333-2.944 26.069333-8.362666s13.653333-13.141333 17.066667-22.144c3.413333-8.96 4.096-18.816 2.048-28.245334a48.554667 48.554667 0 0 0-13.653334-24.576z"
                          p-id="28158"></path>
                        <path
                          d="M298.666667 853.333333m42.666666 0l341.333334 0q42.666667 0 42.666666 42.666667l0 0q0 42.666667-42.666666 42.666667l-341.333334 0q-42.666667 0-42.666666-42.666667l0 0q0-42.666667 42.666666-42.666667Z"
                          p-id="28159"></path>
                      </svg>
                      成为创作者
                    </div>
                  </el-popover>
                </div>
                <div v-if="userInfo.roleId==2" class="cursor-pointer" style="color: #6c5ce7">
                  <el-popover
                    placement="top-start"
                    width="200"
                    trigger="hover"
                    content="创作者可以编写文章、记录时光小记和阅读随笔，且可以使用网站全部功能。">
                    <div slot="reference">
                      <svg t="1763108315082" class="icon-theme-8e44ad svg-translateY-3" viewBox="0 0 1024 1024"
                           version="1.1"
                           xmlns="http://www.w3.org/2000/svg" p-id="45678" width="18" height="18">
                        <path
                          d="M730.327994 746.581089c-40.930659 25.966762-85.969054 39.75702-131.154155 42.397708l-53.987393 34.182235c71.298567 8.362178 142.74384-7.628653 204.359886-46.652149 61.469341-38.876791 106.507736-96.67851 129.393696-164.602866l-53.987393 34.182235c-21.859026 39.75702-53.693983 74.672779-94.624641 100.492837zM432.810515 277.272206c40.930659-25.820057 85.969054-39.610315 131.30086-42.397707l53.987392-34.182235c-71.298567-8.362178-142.74384 7.628653-204.359885 46.505444-61.469341 38.876791-106.507736 96.67851-129.393696 164.602865l53.987392-34.182235c21.859026-39.75702 53.547278-74.37937 94.477937-100.346132z m623.642407 222.25788c4.107736 161.375358-74.37937 320.990258-220.497421 413.414327-146.264756 92.570774-324.07106 95.211461-468.428654 22.739255l-34.915759 22.152435c42.691117 23.766189 88.756447 41.370774 137.169055 52.226934 64.696848 14.523782 130.567335 16.430946 195.704298 5.72149 67.484241-11.14957 131.30086-35.502579 189.395988-72.325501 58.241834-36.969628 107.53467-84.061891 146.558166-140.249857 37.556447-54.280802 64.110029-114.576504 78.633811-179.126648 10.85616-48.412607 14.670487-97.412034 11.296275-146.264756l-34.915759 21.712321zM106.685587 524.323209c-3.961032-161.375358 74.526074-320.990258 220.790831-413.414326s324.07106-95.064756 468.575358-22.592551l34.915759-22.00573C788.276418 42.397708 742.211088 24.939828 693.798481 14.083668c-64.696848-14.523782-130.567335-16.430946-195.704298-5.72149-67.484241 11.14957-131.30086 35.502579-189.542694 72.472206-58.241834 36.969628-107.53467 84.061891-146.558166 140.249857-37.703152 54.134097-64.256734 114.576504-78.780516 179.126647-10.85616 48.412607-14.670487 97.412034-11.296275 146.264757l34.769055-22.152436z m134.234957-164.602865l30.074498 23.619484 0.440115-38.143266 31.688252-21.272207-36.236103-12.176504-10.416046-36.676218-22.88596 30.514613-38.143266-1.320343 22.152435 31.101432-13.203438 35.795989 36.529513-11.44298zM579.515386 924.093983l18.044699 33.74212 15.844126-34.769054 37.556447-6.748424-28.167335-25.820058 5.134671-37.849856-33.302006 18.778223-34.182235-16.430945 7.628653 37.263037-26.553581 27.580516 37.996561 4.254441z m226.072206-103.280229l-14.377077-35.355874-19.365043 32.861891-37.996562 2.787392 25.379943 28.460745-9.095702 36.969628 34.915759-15.257307 32.568482 20.245272-3.814327-37.996561 28.90086-24.646419-37.116333-8.068767zM929.113094 668.974212l-30.221204-23.17937-0.146704 38.143267-31.688253 21.272206 36.382808 12.0298 10.709456 36.529513 22.59255-30.808023 38.143267 1.026934-22.445846-30.954728L965.349197 657.237822l-36.236103 11.73639zM585.676991 107.241261l-18.338109-33.595416L551.93487 108.561605l-37.556447 7.188538 28.31404 25.379943-4.84126 37.849857 33.155301-19.071634 34.475644 16.430946-7.922063-37.409742 26.113467-27.727221-37.996561-3.961031z m-225.191977 104.747278l14.670487 35.209169 19.071633-33.008596 37.996562-3.080803-25.673353-28.31404 8.655588-37.116332-34.62235 15.697421-32.568481-19.805157 4.107736 37.996561-28.90086 24.646419 37.263038 7.775358z m762.425215 177.366189L238.426561 948.887106c-7.775358 4.987966-18.044699 2.640688-23.032665-5.13467L38.321117 664.279656c-4.987966-7.775358-2.640688-18.044699 5.13467-23.032665L927.939455 81.714613c7.775358-4.841261 18.044699-2.640688 22.88596 5.281376L1128.191604 366.468768c4.841261 7.628653 2.493983 17.897994-5.281375 22.88596z m35.355873-42.104298L981.046618 67.77765c-15.404011-24.353009-47.825788-31.541547-72.178796-16.28424L24.384154 611.172493C-0.115559 626.576504-7.304098 658.998281 8.099913 683.204585l177.219485 279.472779c15.550716 24.353009 47.825788 31.541547 72.178796 16.137536l884.483668-559.532379c24.353009-15.404011 31.688252-47.679083 16.28424-72.032091z"
                          p-id="45679"></path>
                        <path
                          d="M448.067822 669.267622c19.511748 32.421777 24.793123 35.062464 33.888825 33.302006 1.173639-0.440115 1.760458 0 2.493983 1.026934 0.440115 0.733524 1.026934 1.613754 1.320344 3.227507 4.694556 19.658453-0.586819 29.340974-23.326075 44.011461-12.616619 8.215473-26.700287 17.017765-41.077364 26.113467-29.047564 18.191404-59.415473 36.822923-81.861318 49.732951-30.954728 17.897994-35.795989 15.844126-49.586246-6.014899l-70.418338-112.669341c-8.362178-13.350143-14.963897-23.326074-20.538682-31.101433l29.194269-3.814327c1.320344-0.146705 2.200573 0 2.493983 0.58682s0.146705 1.320344-0.29341 2.347278l-5.574785 13.203438 14.083668 22.445846 131.887679-82.448138-41.664184-66.604011-135.84871 84.94212c-5.42808 3.374212-12.469914 9.242407-15.697422 13.790258l-13.350143-5.134671c6.895129-3.520917 13.643553-7.188539 19.658453-10.85616l136.875645-85.52894 0.880229-16.57765 26.406877 1.613753c1.320344-0.146705 1.907163 0.29341 2.347278 0.733524s0.440115 1.173639-0.146705 2.640688l-5.134671 11.589685 31.248138 49.879656c2.640688 4.107736 17.017765 23.912894 18.338109 25.966762 1.907163 3.080802 1.026934 5.13467-3.227508 11.149571-1.907163 2.640688-3.227507 4.107736-4.254441 4.84126-1.613754 1.026934-2.640688-0.146705-3.961031-2.200573l-8.948997-14.377077-131.88768 82.301432 59.708883 95.651576c6.308309 10.122636 13.203438 11.296275 30.074499 2.640688 6.0149-3.080802 25.379943-15.110602 47.385673-28.90086 30.514613-19.071633 66.457307-41.957593 77.753582-50.026361 14.523782-10.562751 14.963897-13.350143-14.230373-64.550143l4.987966-2.934097z"
                          p-id="45680"></path>
                        <path
                          d="M310.165243 844.433238c-1.026934 0-2.053868 0-2.934098-0.146705-9.682521-1.467049-15.697421-9.829226-22.445845-20.685387l-70.418338-112.669341c-8.068768-12.910029-14.817192-23.032665-20.391977-30.808023l-5.72149-7.922063 39.170201-4.987965c4.694556-0.440115 7.041834 1.613754 8.068767 3.374212 1.320344 2.200573 1.467049 4.841261 0.146705 7.775358l-4.401146 10.416046 9.389112 14.963896 122.058453-76.286532L327.183008 570.681948l-130.860745 81.861318c-5.42808 3.374212-11.44298 8.655587-14.083668 12.32321l-2.640687 3.667621-29.781089-11.44298 11.589685-6.014899c6.601719-3.374212 13.496848-7.041834 19.365043-10.709456l134.381661-83.915186 1.026935-19.365043 31.981661 1.907163c4.254441-0.146705 6.455014 2.053868 7.335244 3.520917 2.053868 3.374212 0.733524 6.748424 0.29341 7.922063l-0.146705 0.29341-3.814327 8.655587 29.487679 47.238969c1.467049 2.347278 7.335244 10.416046 11.589685 16.284241 4.107736 5.574785 6.161605 8.655587 6.895129 9.535816 4.254441 6.895129 0.29341 12.323209-3.520917 17.604585-2.347278 3.374212-3.961032 5.13467-5.868195 6.308309-1.613754 1.026934-7.188539 3.667622-12.029799-4.107736l-5.868195-9.389112-122.058453 76.286533 56.628081 90.66361c3.520917 5.72149 5.72149 9.095702 22.29914 0.58682 5.868195-2.934097 25.820057-15.404011 46.798854-28.60745l0.146705-0.146705c14.670487-9.095702 63.523209-39.903725 77.460172-49.732951 7.188539-5.13467 7.922063-6.455014 6.895129-11.002866-1.613754-7.628653-8.508883-20.832092-22.739255-45.771919l-2.787393-4.841261 14.817192-9.242407 3.080802 5.13467c19.071633 31.541547 22.739255 31.541547 27.580516 30.661319 2.053868-0.586819 6.0149-0.880229 8.802292 3.667621 0.733524 1.320344 1.613754 2.640688 2.053868 5.134671 5.13467 22.152436-1.173639 34.32894-25.966762 50.173066-12.616619 8.215473-26.553582 16.87106-41.224068 26.113467-23.766189 14.817192-57.2149 35.502579-82.154728 49.879656-14.083668 8.068768-23.912894 12.616619-31.981662 12.616619z m-101.079656-163.135817c4.401146 6.601719 9.389112 14.230372 15.110601 23.47278l70.418339 112.669341c6.0149 9.682521 9.829226 14.670487 14.230372 15.257306 5.42808 0.733524 14.817192-3.961032 27.433811-11.14957 24.646418-14.230372 58.095129-34.769054 81.714613-49.586246 14.670487-9.095702 28.460745-17.751289 41.077364-25.966763 21.859026-13.936963 24.499713-21.712321 20.978797-37.116332-4.547851 0.440115-8.508883-0.586819-12.616619-3.667622 9.095702 19.511748 6.748424 26.700287-6.748424 36.529513-14.083668 10.122636-63.376504 41.077364-78.046992 50.319771l-0.146705 0.146705c-22.152436 13.936963-41.370774 25.820057-47.679083 29.047564-16.137536 8.362178-28.167335 10.416046-37.703152-4.841261l-78.92722-126.459598 4.254441-10.122637-13.350143 1.467049z m169.737536-50.173066l7.775358 12.469914c0-0.146705 0.146705-0.146705 0.146705-0.293409 0.586819-0.880229 2.493983-3.374212 2.934097-4.547851-0.586819-0.880229-3.667622-5.13467-6.308309-8.948998-4.841261-6.748424-10.416046-14.377077-12.0298-17.017765l-32.861891-52.520343 4.401146-9.829227-15.697421-1.026934-0.440115 7.628653 4.107737-2.640687 47.972493 76.726647zM422.247764 472.096275c28.90086-4.987966 48.412607-2.640688 57.068195 2.493983 2.493983 1.760458 4.547851 3.667622 6.0149 6.0149 4.547851 7.335244 3.961032 17.45788-0.440115 20.245272-2.347278 1.467049-5.13467 1.026934-9.829226-2.934098-15.844126-13.790258-29.781089-19.805158-53.107163-21.712321l0.293409-4.107736z m160.788539 80.10086c-15.844126 102.546705-15.550716 110.028653-13.056733 119.711174 0.586819 2.200573 0.29341 3.814327-0.58682 4.401147-0.733524 0.440115-1.467049 0.586819-2.787393 0.293409l-22.00573-5.13467c5.42808-11.73639 5.13467-16.724355-0.58682-25.820057l-59.122063-94.624642-22.739255 15.990831c-6.308309 4.401146-7.922063 6.455014-10.269341 10.85616l-13.643553-3.814327c6.308309-3.227507 9.535817-5.13467 14.817192-8.948997l25.526648-17.751289 0.440114-16.284241 24.793124 0.146705c1.320344-0.146705 1.907163 0.29341 2.347278 0.733524 0.29341 0.586819 0.440115 1.173639-0.146705 2.640688l-4.987966 14.670487L557.509655 639.633238l20.538682-88.756447 4.987966 1.320344z m186.755301 0c-4.547851 2.493983-8.215473 4.401146-11.296275 6.308309-7.775358 4.841261-10.709456 8.508883-12.0298 13.350143-0.440115 2.053868-1.173639 3.227507-2.200573 3.961032-1.320344 0.880229-2.787393 0.733524-5.42808 0.146705-58.535244-14.670487-102.546705-44.158166-162.989112-141.130086-5.868195-9.389112-11.883095-19.511748-18.044699-30.074499l-1.760458 4.107737c34.769054 55.601146 56.774785 102.986819 65.136963 130.42063 12.910029 42.104298 14.083668 84.208596-28.754155 147.5851l-4.254441-2.053868c46.652149-87.582808 43.131232-125.139255-57.80172-292.676218l27.140401-3.080802c3.374212-0.29341 5.281375-0.29341 5.868195 0.733524 0.880229 1.320344 0.29341 2.347278-3.080802 9.535817 73.352436 122.645272 146.411461 166.803438 207.440688 149.345559l2.053868 3.520917z"
                          p-id="45681"></path>
                        <path
                          d="M594.185873 694.20745l-14.230372-7.041834 2.787392-5.281375c44.451576-83.621777 44.451576-117.510602-57.655014-286.808023l-4.694556-7.775358 36.236103-4.107737c3.814327-0.29341 8.802292-0.880229 11.589685 3.374212 2.200573 3.520917 1.467049 6.161605-1.467049 12.323209C633.502779 509.359312 704.067822 560.412607 765.830572 542.808023l4.254442-1.173639 7.922063 12.616619-8.215473 4.401146c-3.374212 1.760458-6.0149 3.227507-8.362178 4.694556-7.481948 4.694556-8.655587 7.188539-9.389112 9.829226-0.29341 1.467049-1.320344 5.281375-4.84126 7.481949-3.374212 2.053868-6.895129 1.467049-9.829227 0.880229-45.47851-11.44298-83.621777-31.248138-128.660172-88.903152 7.775358 16.724355 13.936963 31.834957 17.75129 44.598281 13.790258 45.038395 14.083668 88.169628-29.487679 152.573066l-2.787393 4.401146z m-54.280802-297.517479c51.346705 85.675645 73.352436 132.327794 80.394269 170.471061 1.613754 8.655587 2.493983 16.724355 2.493983 24.646418 0.733524-17.751289-2.347278-34.32894-7.481948-51.053295-7.481948-24.499713-28.460745-71.298567-64.550144-128.953582l-1.613753-2.640688 4.254441-9.535816-0.146705-0.146705 1.320344-2.787393c0.29341-0.586819 0.586819-1.026934 0.733524-1.613753l-15.404011 1.613753z m100.786246 115.016619c33.74212 35.209169 64.256734 49.586246 99.612608 58.388539 0.146705 0 0.440115 0.146705 0.586819 0.146705 1.320344-4.841261 3.961032-8.655587 8.508883-12.469914-27.287106 2.200573-55.454441-6.748424-84.355301-26.553582-8.215473-5.72149-16.284241-12.176504-24.353009-19.511748z m-72.765616 170.76447c-1.026934 0-1.907163-0.146705-2.640687-0.29341l-29.047565-6.748424 3.080802-6.601719c4.841261-10.416046 4.254441-13.203438-0.146704-20.245272l-55.747851-89.343267-17.604585 12.469915c-5.72149 3.961032-6.601719 5.281375-8.508882 8.802292l-2.200574 4.107736-32.715186-9.095702 13.350143-6.895129c6.0149-3.080802 8.948997-4.987966 14.083668-8.508882l23.17937-16.137536 0.440114-19.071633 30.367909 0.146705c4.401146-0.29341 6.601719 2.053868 7.481948 3.520916 2.053868 3.227507 0.880229 6.455014 0.440115 7.775359l-4.107737 12.029799 47.532379 75.993123 18.631518-80.687679 16.137536 3.667622-0.880229 5.42808c-15.550716 100.932951-15.404011 108.708309-13.203439 117.363897 1.320344 4.547851 0 8.802292-3.080802 10.85616-1.907163 1.173639-3.520917 1.467049-4.841261 1.467049z m-3.520917-8.508882z m-11.883094-6.748424l10.85616 2.493982c-1.026934-6.161605-1.026934-14.377077 2.200573-39.46361l-5.72149 24.499714-65.283667-104.600574 4.401146-13.056733-14.230373-0.146705-0.146704 7.041834 2.053868-1.467049 62.34957 99.906017c5.574785 9.095702 6.748424 15.404011 3.520917 24.793124zM482.250057 507.598854c-5.13467 0-9.389112-3.667622-11.149571-5.134671-15.404011-13.350143-28.460745-18.631519-49.732951-20.245272l-5.868195-0.440114 1.026934-14.523783 4.547851-0.733524c27.433811-4.694556 49.732951-3.520917 61.175932 3.227507l0.293409 0.146705c3.227507 2.200573 5.72149 4.841261 7.628654 7.775358 2.787393 4.401146 4.254441 9.975931 4.107736 15.110602-0.146705 6.0149-2.493983 10.85616-6.308309 13.203438-1.907163 1.026934-3.814327 1.613754-5.72149 1.613754z m-33.888826-32.275072c11.002865 3.667622 20.391977 9.389112 30.514614 18.191404 1.613754 1.320344 2.493983 1.907163 3.080802 2.200573 0.880229-1.613754 1.320344-7.188539-1.613754-11.883094-1.026934-1.613754-2.347278-2.934097-4.107736-4.254442-4.547851-2.640688-13.790258-4.694556-27.873926-4.254441z"
                          p-id="45682"></path>
                        <path
                          d="M677.074125 303.385673c29.340974-0.146705 48.999427 3.520917 55.454442 13.643553 4.694556 7.628653 3.814327 19.071633 0 21.418912-3.667622 2.347278-5.72149 1.320344-13.350144-8.068768-6.161605-7.481948-20.245272-18.484814-42.837822-23.326075l0.733524-3.667622zM833.314813 424.857307c-9.975931 54.867622-10.562751 75.993123-8.948997 86.262464 0.146705 2.053868 0.146705 3.227507-0.58682 3.667622-0.586819 0.29341-1.173639 0.440115-2.200573 0l-22.00573-6.60172c4.987966-8.948997 6.0149-17.16447 1.467048-24.499713l-60.442406-96.67851-15.404012 11.44298c-6.455014 4.694556-10.85616 9.389112-13.936963 14.230372l-13.790258-3.374212c6.455014-3.667622 13.056734-8.215473 18.484814-12.323209l20.391977-14.963897 1.173639-16.724355 24.059599 3.520917c1.320344 0.29341 2.347278 0.733524 2.787393 1.467049s0.29341 2.347278-0.58682 4.401146l-6.308309 13.056733 55.161031 88.316333 16.284241-51.933525 4.401146 0.733525z m187.195416-45.038396c2.934097 0.733524 4.987966 1.613754 5.42808 2.347278 0.586819 1.026934-0.29341 2.347278-3.227507 4.107737l-157.854442 98.585673c-5.42808 3.374212-12.616619 9.389112-15.844126 13.496848l-13.203438-4.841261c6.601719-3.374212 13.643553-7.188539 19.658453-10.85616l26.846991-16.87106-62.64298-100.346132c-6.748424-10.709456-16.724355-25.526648-23.17937-34.91576l25.526648-2.200573c2.493983-0.146705 3.961032 0 4.694556 1.026935 0.440115 0.733524 0.29341 2.347278-0.58682 4.401146l-3.814326 8.508882 72.325501 115.750143 40.783954-25.526647-113.25616-181.327221L771.698767 283.140401c-5.42808 3.374212-12.616619 9.389112-15.844126 13.496848l-13.203438-4.84126c6.601719-3.374212 13.790258-7.188539 19.658452-10.856161l105.040688-65.577077 1.760459-22.88596 27.287106 4.694556c2.493983 0.586819 4.401146 1.173639 5.13467 2.347278s-0.146705 2.640688-2.787392 4.254441L834.781862 243.823496l49.439541 79.22063 34.03553-21.272206 1.907164-23.766189 25.233238 6.748424c2.493983 0.586819 4.107736 1.467049 4.84126 2.493983 0.880229 1.320344 0.146705 2.493983-2.200573 3.961031l-60.148997 37.556447 60.295702 96.3851 43.131232-26.993696 2.200573-24.939828 26.993697 6.601719z"
                          p-id="45683"></path>
                        <path
                          d="M822.752062 520.948997c-1.026934 0-2.053868-0.146705-3.227507-0.733524l-28.60745-8.655588 3.520917-6.308309c5.574785-9.975931 3.520917-15.404011 1.613754-18.484814l-57.068195-91.25043-10.269341 7.628654c-5.72149 4.254441-9.682521 8.215473-12.616619 12.616619l-2.200573 3.520916-32.128367-7.922063 12.763324-7.335243c5.72149-3.227507 12.029799-7.481948 17.897994-11.883095l18.338109-13.350143 1.467049-20.391977 30.661318 4.547851c2.934097 0.733524 5.13467 2.053868 6.455014 4.107736 1.173639 1.760458 2.053868 4.987966-0.146705 9.829227l-0.146704 0.146705-4.987966 10.122636 46.652149 74.672779 13.936963-44.744986 15.404011 2.787393-1.026934 5.72149c-5.13467 27.873926-8.068768 49.292837-9.095702 64.256733l3.374212-1.760458c6.601719-3.374212 13.496848-7.041834 19.365043-10.562751l22.005731-13.643553-59.562178-95.358166c-6.601719-10.562751-16.57765-25.379943-23.032665-34.622349l-5.868195-8.362178 35.942694-3.080802c2.493983-0.146705 7.335244-0.29341 9.829226 3.814326 1.173639 1.760458 2.053868 4.987966-0.146705 9.829227l-2.493982 5.574785 67.630945 108.12149 30.808023-19.218338-107.094556-171.35129-45.77192 28.60745c-5.281375 3.227507-11.73639 8.802292-14.377077 12.176504l-2.640688 3.374212-29.781088-10.85616 11.883094-6.161605c6.601719-3.374212 13.496848-7.041834 19.365043-10.56275l102.546705-64.110029 1.907163-26.406877 34.03553 5.868195c3.374212 0.733524 6.895129 1.907163 8.655588 4.841261 1.467049 2.493983 1.467049 5.42808-0.146705 8.068768-1.026934 1.613754-2.493983 2.934097-4.547851 4.254441l-58.975358 36.822923 43.277937 69.244699 26.553581-16.577651 2.200573-27.72722 31.981662 8.508882c2.640688 0.586819 6.308309 1.760458 8.362178 4.987966 1.613754 2.493983 1.613754 5.42808 0.146705 7.922063-0.880229 1.467049-2.200573 2.787393-4.254441 4.107736L895.957793 330.08596l53.987393 86.409169 35.649283-22.29914 2.493983-28.90086 33.888825 8.068768c6.308309 1.467049 8.215473 3.520917 9.095702 4.987965 1.613754 2.640688 1.467049 5.868195-0.586819 8.508883-1.026934 1.320344-2.347278 2.493983-4.547851 3.814327l-157.854441 98.585673c-5.281375 3.374212-11.73639 8.802292-14.377078 12.176504l-2.640688 3.374212-21.71232-7.922063c-0.146705 5.281375 0 9.389112 0.586819 12.616619v0.440115c0.146705 2.200573 0.586819 6.748424-3.374212 9.242407-0.586819 1.026934-1.907163 1.760458-3.814327 1.760458z m-14.963896-16.57765l10.26934 3.080802c-0.586819-6.601719-0.440115-16.87106 1.907164-35.355874l-5.574785 17.751289-63.669914-101.959885 6.748424-13.936963-14.523783-2.200573-0.440114 6.895129 63.523209 101.666476c4.401146 7.188539 4.987966 15.257307 1.760459 24.059599z m-0.58682-168.563897c5.868195 8.655587 12.616619 18.924928 17.604585 26.846991l63.229799 101.079656 2.347278-1.467048-74.526075-119.124356 3.667622-8.362177-12.323209 1.026934z m19.658453-88.169628l0.440114 0.733525 113.84298 182.060745 2.347278-1.467049-0.440114-0.733524-60.735817-97.118625-53.107163-84.94212-2.347278 1.467048z m171.644699 132.914614l-1.320344 14.963896 17.604585-11.002865-16.284241-3.961031z m-177.219484-49.879657z m104.013753-45.1851l-1.026934 13.496848 15.404012-9.682521-14.377078-3.814327zM874.392177 199.37192l-1.026934 13.203438 16.87106-10.562751-15.844126-2.640687z m23.032665 4.254441z m-167.977078 141.86361c-5.72149 0-10.269341-5.42808-14.963896-11.296275-6.161605-7.628653-19.805158-17.16447-39.610316-21.272206l-5.868195-1.173639 3.227508-14.230372h4.694556c34.62235-0.146705 53.253868 4.841261 60.442406 16.430945 6.748424 10.85616 4.547851 25.526648-1.907163 29.487679-2.053868 1.467049-4.107736 2.053868-6.0149 2.053868z m-0.586819-11.736389zM702.747478 310.427507c12.029799 6.308309 18.631519 13.496848 20.978796 16.284241 2.934097 3.667622 4.694556 5.42808 5.72149 6.308309 0.880229-2.347278 1.026934-8.362178-1.760458-12.910028-3.227507-4.841261-11.44298-8.068768-24.939828-9.682522z"
                          p-id="45684"></path>
                      </svg>
                      创作者
                    </div>
                  </el-popover>

                </div>
                <div v-if="userInfo.roleId==3" class="cursor-pointer" style="color:#c56cf0;">
                  <el-popover
                    placement="top-start"
                    width="200"
                    trigger="hover"
                    content="管理员拥有站点所有的权限，且站点相关邮件也会通知管理员。">
                    <div slot="reference">
                      <svg t="1763109003253" class="icon svg-translateY-2" viewBox="0 0 1024 1024" version="1.1"
                           xmlns="http://www.w3.org/2000/svg" p-id="54796" width="18" height="18">
                        <path
                          d="M973.596023 787.237859l-82.846194 233.982216h-248.595444l-82.448169-233.982216c-21.209081-1.819546-46.057253-19.389535-46.057253-41.053502 0-22.858044 23.142348-41.451528 46.057253-41.451528 22.858044 0 41.451528 14.385784 41.451528 37.300689 0 8.813425-3.184205 21.038498-7.846791 27.748073 14.613227 23.142348 38.153601 67.891802 67.550637 67.891803 29.397037 0 72.724971-55.837311 81.936421-91.489037l0.625469-3.468509 2.274433-43.72596c-12.281934-7.164462-25.985388-20.356169-25.985389-35.651726 0-22.914905 22.744322-40.712337 46.739583-40.712337 24.052121 0 48.559128 17.797432 48.559128 40.712337 0 15.295557-15.523 28.487264-27.861795 35.651726l1.478381 43.04363 1.478381 4.150839c9.211451 35.651725 39.347678 91.489037 77.899304 91.489037 29.397037 0 56.974528-44.749454 71.644616-67.891803a55.951033 55.951033 0 0 1-8.074235-27.748073c0-22.914905 19.162092-37.300689 42.076997-37.300689 22.858044 0 46.284696 22.232575 46.284696 45.14748 0 21.607106-25.189337 35.538004-46.341557 37.35755z m-437.032155 128.619143s34.457648 98.255473 35.651726 107.637505c-25.871667 1.137216-45.488645 0-73.35044 0-213.398605 0-397.17273-34.628231-426.456045-41.167223-29.226454-6.595853-46.682722-12.168212-52.880549-16.717077-7.562487-5.572359-13.077985-22.061993-16.717077-49.753205-3.582231-27.861795-2.160711-34.798813 4.548864-78.126748 4.2077-25.018755 14.385784-44.180846 30.477392-56.860806a188.607293 188.607293 0 0 1 57.429414-30.477392c22.175714-7.562487 124.354583-42.759326 147.838096-48.900293a205.722396 205.722396 0 0 0 61.40967-26.440275c14.328923-8.756564 25.303059-17.342546 33.036128-25.473641 7.78993-8.187956 13.362289-16.319051 16.319052-24.450146 3.013623-8.187956 4.548864-16.489634 4.548864-25.473641 0-8.756564-0.341165-18.30918-0.966634-28.657846-1.364659-16.319051-6.538993-28.828429-15.693582-37.528132a511.747254 511.747254 0 0 0-31.046-27.52063 60.272454 60.272454 0 0 1-14.328923-19.901283c-4.150839-8.529121-7.73307-17.058242-11.144718-25.814805-3.411648-10.121223-6.766436-20.697333-10.121224-31.444026a43.953403 43.953403 0 0 1-14.328923-7.164462 86.883312 86.883312 0 0 1-13.305428-14.272062 84.324575 84.324575 0 0 1-12.338795-26.497136c-3.411648-11.3153-4.548864-21.834549-3.411649-30.989139 1.023495-9.15459 2.84304-17.115103 5.572359-23.881538 2.615597-7.562487 6.823297-14.499506 12.338795-21.493385a481.895331 481.895331 0 0 1 18.877788-146.587158c7.164462-24.450147 17.513128-46.512139 31.046-66.015396 12.907403-18.30918 27.293187-33.434154 43.214212-45.374923 15.864165-11.940769 31.955773-21.265941 48.331686-28.032377 16.262191-6.766436 32.581242-11.372161 49.298318-14.328923C456.845018 1.592103 472.993487 0 488.68707 0c19.446396 0 38.551626 2.388154 56.46278 7.164462 17.911154 4.776308 34.628231 10.746692 50.321813 18.309179 15.523 7.562487 29.62448 15.693582 41.508389 24.848172 12.395656 9.097729 22.175714 18.479762 29.68134 28.032378 16.887659 21.663967 29.62448 45.545506 38.210462 71.644615 8.529121 26.042249 14.499506 50.492396 17.683711 73.577883 4.150839 27.008883 5.742941 54.245209 5.174333 81.310953 4.776308 2.615597 8.529121 6.823297 11.144718 12.338794 2.558736 4.776308 4.94689 10.746692 6.538993 18.30918 1.592103 7.562487 1.819546 16.489634 0.398025 27.463769a112.925561 112.925561 0 0 1-9.552615 34.002762c-4.548864 8.529121-9.325172 15.068114-14.670088 19.901282a49.241458 49.241458 0 0 1-19.332674 11.087858 362.260195 362.260195 0 0 1-9.097729 31.444025c-3.411648 8.756564-7.391905 17.513128-11.599605 25.871667-4.548864 8.529121-9.325172 15.124974-14.670088 19.901282a157.504433 157.504433 0 0 1-17.342545 13.646593 95.355572 95.355572 0 0 0-14.328923 11.599605 48.559128 48.559128 0 0 0-10.121224 14.726949 86.76959 86.76959 0 0 0-6.140967 20.867915c-1.990128 10.121223-2.615597 20.46989-1.990128 30.98914 0.568608 10.348667 3.411648 21.095359 8.131095 31.444025 4.776308 10.348667 30.647974 36.959524 41.565249 46.569 3.184205 2.786179-24.336425 18.593484-41.508388 0-24.507007-26.497136-52.994271-34.457648-52.994271-34.457648-35.651725 0-70.166235 6.254689-83.471663 17.285685-15.523 12.850542-36.845802 46.739583-36.845803 76.818949 0 33.377293 10.519249 78.411051 60.101872 103.03178l24.563868 78.126748z"
                          fill="#c56cf0" p-id="54797"></path>
                      </svg>
                      管理员
                    </div>
                  </el-popover>

                </div>

              </div>
            </div>
            <hr class="hr-item mb-10"/>
            <el-skeleton :rows="3" animated v-if="!statDataInfoLoading"/>
            <div v-if="statDataInfoLoading" style="padding: 2px">
              <div class="flex-space-between text-center line-height-20"
                   v-if="statDataInfoLoading">
                <div title="点击跳转">
                  <nuxt-link to="/white/user_lit" rel="noopener">
                    <h4 class="color-theme font-s-16">
                      <countTo :startVal='0' :endVal='statDataInfoVo.userCount' :duration='2000'></countTo>
                    </h4>
                    <div class="color-grey font-s-15 text-underline-hover">用户数</div>
                  </nuxt-link>
                </div>
                <div>
                  <h4 class="color-theme font-s-16">
                    <countTo :startVal='0' :endVal='statDataInfoVo.specialCount' :duration='2000'></countTo>
                  </h4>
                  <div class="color-grey font-s-15">专栏数</div>
                </div>
                <div title="点击跳转">
                  <nuxt-link to="/label" rel="noopener">
                    <h4 class="color-theme font-s-16">
                      <countTo :startVal='0' :endVal='statDataInfoVo.labelCount' :duration='2000'></countTo>
                    </h4>
                    <div class="color-grey font-s-15 text-underline-hover">标签数</div>
                  </nuxt-link>
                </div>
              </div>
              <div class="flex-space-between text-center line-height-20 mt-20">
                <div>
                  <h4 class="color-theme font-s-16">
                    <countTo :startVal='0' :endVal='statDataInfoVo.articleCount' :duration='2000'></countTo>
                  </h4>
                  <div class="color-grey font-s-15">文章数</div>
                </div>
                <div title="点击跳转">
                  <nuxt-link to="/dictum" rel="noopener">
                    <h4 class="color-theme font-s-16">
                      <countTo :startVal='0' :endVal='statDataInfoVo.dictumCount' :duration='2000'></countTo>
                    </h4>
                    <div class="color-grey font-s-15 text-underline-hover">随笔数</div>
                  </nuxt-link>
                </div>
                <div title="点击跳转">
                  <nuxt-link to="/time_notes" rel="noopener">
                    <h4 class="color-theme font-s-16">
                      <countTo :startVal='0' :endVal='statDataInfoVo.timeNotesCount' :duration='2000'></countTo>
                    </h4>
                    <div class="color-grey-2 font-s-16 text-underline-hover">小记数</div>
                  </nuxt-link>
                </div>
              </div>
            </div>
          </div>
          <!--        精选文章-->
          <div class="selected-articles-info mt-5">
            <div class="flex-space-between align-items-center mb-10">
              <div class="font-bold ml-10">精选文章</div>
              <div>
                <el-button @click="selectedArticleListApi()"
                           type="text" :loading="selectedArticleLoading" icon="el-icon-refresh">
                  换一换
                </el-button>
              </div>
            </div>
            <el-skeleton :rows="6" animated v-if="selectedArticleLoading"/>
            <ul v-show="!selectedArticleLoading">
              <li v-for="(item,index) in selectedArticleList" :key="index" :ref="`selectedArticlesItem${index}`"
                  class="recommend-article-item flex-left align-items-center font-s-16"
                  :title="item.articleTitle">
                <div class="flex-1 mr-6 text-center">
                  <h1 v-if="index<=2" class="font-s-15"
                      :style="index==0?'color:#eb4d4b':index==1?'color:#f9ca24':'color:#4cd137'">
                    {{ index + 1 }}
                  </h1>
                  <h1 class="font-s-15" v-else>
                    {{ index + 1 }}
                  </h1>
                </div>
                <div class="cursor-pointer overflow-nowrap-1 flex-10">
                  <nuxt-link class="text-underline-hover"
                             :to="`/article-details/`+$base64.encode(item.id)" target="_blank"
                             rel="noopener">
                    {{ item.articleTitle }}
                  </nuxt-link>
                </div>
              </li>
            </ul>
          </div>
          <hr class="hr-item" style="margin: 0px 20px 15px 20px"/>
          <!-- 备案-->
          <el-skeleton class="mt-10" :rows="3" animated v-if="siteInfoLoading"/>
          <div class="mt-10 ml-10 line-height-30 font-s-14 color-grey" style="padding: 0 10px;"
               v-if="!siteInfoLoading">
            <a href="https://beian.miit.gov.cn" class="hover-cl" target="_blank"
               rel="nofollow">{{ siteInfo.filings }}</a>
            .
            <span>反馈邮箱：{{ siteInfo.mailbox }}</span>
            .
            <soan>开源地址：</soan>
            <a href="https://gitee.com/yu-zi-wei/qixidi" target="_blank"
               class="text-underline-hover color-grey"><span style="color: #ee5a24">gitee.com</span></a>
            .
            <a href="https://github.com/yu-zi-wei/Qixidi-KnowledgeCommunity" target="_blank"
               class="text-underline-hover color-grey"><span style="color: #ee5a24">gitHub.com</span></a>
            <div>小站已经运行了：{{ siteOperationTime }}</div>
            <div>
              © {{ $utils.parseTime(new Date(), '{y}') }} 栖息地
            </div>
            <!--              订阅rss-->
            <div title="订阅RSS">
              <nuxt-link class="text-underline-hover color-grey" to="rss.xml" rel="noopener" target="_blank">
                <svg t="1745568361410" class="icon-theme-1 svg-translateY-2" viewBox="0 0 1024 1024" version="1.1"
                     xmlns="http://www.w3.org/2000/svg" p-id="4983" width="12" height="12">
                  <path
                    d="M306.172191 420.340417c-45.686529-15.009855-95.144964-22.849404-146.053424-23.295566-12.485359-1.335415-24.696472 2.944052-33.541931 11.790534-15.757892 15.757892-16.737196 40.532135-2.158153 55.112202 4.016477 4.016477 9.081843 6.831592 15.454994 8.492418l1.373277 1.373277 3.913123-0.063445c42.561351-0.209778 82.817194 6.701632 130.519636 22.416546 157.437705 51.79976 262.621303 197.078541 274.610358 379.098107l0.86367 9.656941 0.86367-0.130983c1.517563 5.234211 4.213975 9.81453 7.983835 13.58439 13.768585 13.768585 37.062104 12.878309 51.877531-1.937119 4.997827-4.997827 8.532327-11.044544 10.338463-17.616216l2.146896-0.26299-0.394996-8.664334c-9.289574-215.804021-131.041522-388.125715-317.794903-449.556832M155.48626 755.924475c-30.467919 30.467919-30.494525 80.015382-0.039909 110.469997 30.439266 30.439266 80.015382 30.440289 110.482277-0.027629 30.414707-30.414707 30.413684-79.989799-0.025583-110.429065C235.449453 725.483162 185.900967 725.509768 155.48626 755.924475M475.429083 163.478282c-97.17418-37.179784-200.406333-54.302767-302.476009-46.540989l-5.390777 5.390777-0.733711 0.733711c-27.065426 9.841136-33.200146 44.750203-13.973246 63.97608 4.581342 4.581342 14.814404 9.457396 21.331841 11.210319l0 0 0 0c90.249467-7.066953 188.100052 6.101975 273.745664 38.820144 260.736373 99.708909 415.950434 355.591741 369.150548 608.384188l-2.041496 11.096732 2.852978 0.027629c1.622964 7.223518 5.208629 13.845333 10.549264 19.185968 15.417131 15.417131 40.46562 15.388479 55.855122 0 4.424776-4.424776 7.644097-9.78997 9.447163-15.888875l1.231037 0.079818 1.493004-8.089235C946.517301 565.463656 769.473049 275.92326 475.429083 163.478282L475.429083 163.478282z"
                    p-id="4984"></path>
                </svg>
                rss 订阅
              </nuxt-link>
            </div>
          </div>
        </div>
      </div>
      <LoginModule :isLogin="isLoginBinlog" @loginDialogMethod="loginDialogMethod"></LoginModule>

      <el-dialog
        title="创作者申请"
        :visible.sync="becomeCreatorDialog"
        width="35%">
        <div>
          <div class="mb-10">
            <el-alert
              title="创作者身份为什么需要申请？"
              type="info"
              description="网站是面向有有用户的，为了保证内容的质量和减少测试内容的产生，导致其他正常用户的阅读体验。我们需要对创作者做一个简单的认证。"
              show-icon>
            </el-alert>
          </div>
          <el-alert
            title="如何申请？"
            description="请说明你的创作方向（如生活分享、知识科普等），申请内容≥20 字作者会在～48 小时内审核反馈，审核通过后所发布的内容需积极健康、合规合法哦～"
            type="warning"
            show-icon>
          </el-alert>
          <div class="border-all-1-DCDFE6 border-radius-4 mt-20">
            <el-input type="textarea" placeholder="请输入申请内容"
                      maxlength="200"
                      show-word-limit
                      :rows="6" v-model="becomeCreatorContent"></el-input>
          </div>
        </div>
        <div slot="footer" class="dialog-footer">
          <el-button @click="becomeCreatorDialog = false">取 消</el-button>
          <el-button type="primary" :loading="becomeCreatorLoading" @click="becomeCreatorSubmit()">提 交</el-button>
        </div>
      </el-dialog>
    </div>
  </div>
</template>

<script>
import countTo from 'vue-count-to';
import {createAnimator} from '~/plugins/animationUtils'

export default {
  name: "index",
  components: {countTo},
  data() {
    return {
      websiteName: process.env.PROJECT_NAME,
      themeColor: process.env.THEME_COLOR,
      sidebarDialog: true,
      labelGroupingDialog: true,
      sidebarList: [],
      labelGroupingList: [],
      userInfo: null,
      goTopLoading: false,

      isReport: false,
      reportLoading: true,
      ctnFatalism: 0,
      sumFatalism: 0,

      initialLoading: true,
      selectedArticleLoading: true,
      selectedArticleList: [],

      positionCssRight: true,

      isLoginBinlog: false,
      userInfoLoading: true,

      siteInfoLoading: true,
      siteInfo: true,
      siteOperationTime: null,
      statDataInfoVo: {},
      statDataInfoLoading: false,
      animator: null, // 动画器实例
      becomeCreatorDialog: false,
      becomeCreatorContent: null,
      becomeCreatorLoading: false,
    }
  },
  methods: {
    becomeCreatorSubmit() {
      if (this.becomeCreatorContent == null || this.becomeCreatorContent.trim().length < 20) {
        this.$message({
          message: '申请内容不能少于20个字符',
          type: 'warning'
        });
        return;
      }
      this.becomeCreatorLoading = true;
      this.$API("/front-desk/user/creator/application", "post", null, {
        applicationContent: this.becomeCreatorContent
      }).then(res => {
        if (res.code == 200) {
          this.$modal.msg("申请发送成功，“紫薇”会在48小时内通知审核情况")
          this.becomeCreatorDialog = false;
          this.becomeCreatorLoading = false;
        }
      })
    },
    signIn() {
      if (this.userInfo != null) {
        this.$router.push("/sign_in/daily");
        return;
      }
      this.isLoginBinlog = true;
    },
    loginDialogMethod(val) {
      this.isLoginBinlog = val;
    },
    gitUserInfo() {
      this.userInfoLoading = false
      this.$API("/front-desk/user/info", this.$get()).then(res => {
        this.userInfo = res.data;
      }).finally(() => this.userInfoLoading = false);
    },
    selectedArticleListApi() {
      this.selectedArticleLoading = true;
      this.$API("/white/article/selected", this.$get()).then(res => {
        this.selectedArticleList = res.data;
      }).finally(() => {
        this.selectedArticleLoading = false
        this.$nextTick(() => {
          this.animator.triggerAllItemsAnimation(this.selectedArticleList, 'selectedArticlesItem');
        });
      });
    },
    getSiteInfo() {
      this.siteInfoLoading = true;
      this.$API("/white/site/info", this.$get()).then(res => {
        this.siteInfo = res.data;
        this.siteOperationTime = this.timeDifference(this.siteInfo.createTime);
      }).finally(() => this.siteInfoLoading = false);
      this.$API("/white/site/total-data", this.$get()).then(res => {
        this.statDataInfoVo = res.data;
      }).finally(() => this.statDataInfoLoading = true);
    },
    timeDifference(targetDateString) {
      // 解析目标时间
      const targetDate = new Date(targetDateString);
      // 获取当前时间
      const now = new Date();
      // 计算时间差（毫秒）
      let diffInMillis = now - targetDate;
      // 计算年、月、日
      const oneDayMillis = 24 * 60 * 60 * 1000; // 一天的毫秒数
      const oneMonthMillis = 30 * oneDayMillis; // 大约一个月的毫秒数
      const oneYearMillis = 365 * oneDayMillis; // 大约一年（365天）的毫秒数

      let years = Math.floor(diffInMillis / oneYearMillis);
      diffInMillis -= years * oneYearMillis;
      let months = Math.floor(diffInMillis / oneMonthMillis);
      diffInMillis -= months * oneMonthMillis;
      let days = Math.floor(diffInMillis / oneDayMillis);

      return `${years}年${months}月${days}天`;
    },

    listSidebar() {
      let sidebarList = localStorage.getItem('sidebarList');
      if (sidebarList != null) {
        this.sidebarList = JSON.parse(sidebarList);
        this.sidebarDialog = false
      }
      let labelGroupingList = localStorage.getItem('labelGroupingList');
      if (sidebarList != null) {
        this.labelGroupingList = JSON.parse(labelGroupingList);
        this.labelGroupingDialog = false
      }
      this.$API("/frontDesk/user/report/list", this.$get()).then(res => {
        if (res.data != null) {
          this.ctnFatalism = res.data.ctnFatalism;
          this.isReport = res.data.isReport;
          this.sumFatalism = res.data.sumFatalism;
        }
      }).finally(() => this.reportLoading = false);

      this.selectedArticleListApi();
      this.getSiteInfo();
      this.$API("/white/label/grouping/list", this.$get(), {pageNum: 0, pageSize: 12,}).then(res => {
        this.labelGroupingList = res.rows;
        localStorage.setItem("labelGroupingList", JSON.stringify(this.labelGroupingList));
      }).finally(() => this.labelGroupingDialog = false);

      this.$API("/white/configure/sidebar/list", this.$get(), {type: 1, status: 0}).then(res => {
        this.sidebarList = res.data;
        localStorage.setItem("sidebarList", JSON.stringify(this.sidebarList));
      }).finally(() => this.sidebarDialog = false);
    },
    handleScroll() {
      let scrollTop = document.documentElement.scrollTop
      let clientHeight = document.documentElement.clientHeight
      if (scrollTop > (clientHeight / 2)) {
        this.goTopLoading = true;
      } else {
        this.goTopLoading = false;
      }
      // let scrollHeight = document.documentElement.scrollHeight
      if (scrollTop > (clientHeight / 1)) {
        this.positionCssRight = false;
      } else {
        this.positionCssRight = true;
      }
    },
  },
  mounted() {
    // 初始化动画器
    this.animator = createAnimator(this, 'commonList');
    this.gitUserInfo();
    this.listSidebar();
    window.addEventListener('scroll', this.handleScroll, true);// 向页面添加滚动事件
  },
  destroyed() {
    //离开页面时删除该监听
    window.removeEventListener('scroll', this.handleScroll, true)
  }
}
</script>

<style scoped>
@import url("static/css/server/pc/index/index.css");

.el-menu-item {
  height: 42px !important;
  line-height: 38px !important;
}

.el-button--medium {
  padding: 10px 20px;
}

</style>
